<template>
  <el-form style="width: 100%" :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm">
    <el-form-item  prop="case_item_id"
                   label="测试项目标识">
      <el-input v-model="ruleForm.case_item_id"></el-input>
    </el-form-item>
    <el-form-item  prop="case_id"
                   label="测试用例标识">
      <el-input v-model="ruleForm.case_id"></el-input>
    </el-form-item>
    <el-form-item prop="case_edition"
                  label="测试版本">
      <el-input v-model="ruleForm.case_edition"></el-input>
    </el-form-item>
    <el-form-item  prop="case_result"
                   label="实际测试结果">
      <el-input v-model="ruleForm.case_result"></el-input>
    </el-form-item>
    <el-form-item prop="result" label="执行结果">
      <el-select v-model="ruleForm.result" placeholder="请选择执行结果">
        <el-option label="通过" value="通过"></el-option>
        <el-option label="不通过" value="不通过"></el-option>
      </el-select>
    </el-form-item>
    <div v-if="ruleForm.result == '不通过'">
      <el-button type="text">BUG 创建</el-button>
      <el-dialog title="BUG 创建" :visible.sync="dialogFormVisible">
        <el-form :model="form" :rules="rules1">
          <el-form-item label="测试项目标识" :label-width="formLabelWidth">
            <el-input v-model="form.case_item_id" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="测试用例标识" :label-width="formLabelWidth">
            <el-input v-model="form.case_id" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="问题标识" :label-width="formLabelWidth">
            <el-input v-model="form.problem_id" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="问题类别" :label-width="formLabelWidth">
            <el-select v-model="form.problem_category" placeholder="请选择活动区域">
              <el-option label="设计" value="设计"></el-option>
              <el-option label="文档" value="文档"></el-option>
              <el-option label="程序" value="程序"></el-option>
              <el-option label="规范性问题" value="规范性问题"></el-option>
              <el-option label="其他问题" value="其他问题"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="问题级别" :label-width="formLabelWidth">
            <el-select v-model="form.problem_level" placeholder="请选择活动区域">
              <el-option label="致命" value="致命"></el-option>
              <el-option label="严重" value="严重"></el-option>
              <el-option label="一般" value="一般"></el-option>
              <el-option label="建议" value="建议"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="问题描述" :label-width="formLabelWidth">
            <el-input v-model="form.problem_description" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="备注" :label-width="formLabelWidth">
            <el-input v-model="form.remark" auto-complete="off"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="info" @click="submitForm1('form')">提交</el-button>
        </div>
      </el-dialog>
    </div>
    <el-form-item   prop="problem_id"
                    label="问题标识">
      <el-input v-model="ruleForm.problem_id"></el-input>
    </el-form-item>
    <el-form-item  prop="test_user"
                   label="测试人员">
      <el-input v-model="ruleForm.test_user"></el-input>
    </el-form-item>
    <el-form-item  prop="control_user"
                   label="监督人员">
      <el-input v-model="ruleForm.control_user"></el-input>
    </el-form-item>
    <el-form-item  prop="datetime"
                   label="测试时间">
      <el-col :span="11">
        <el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.datetime" style="width: 100%;"></el-date-picker>
      </el-col>
    </el-form-item>
    <el-form-item size="large">
      <el-button type="info" @click="submitForm('ruleForm')">提交</el-button>
      <el-button>取消</el-button>
    </el-form-item>
  </el-form>
</template>
<script>
import axios from 'axios'
export default {
  data() {
    return {
      ruleForm: {
        case_id: '',
        test_user: '',
        control_user: '',
        datetime: '',
        case_edition: '',
        case_result: '',
        result: '',
        problem_id: '',
        case_item_id: ''
      },
      dialogFormVisible: true,
      form: {
        case_item_id: 'DYJK',
        case_id: 'DYJK-GN-SBYL-1',
        problem_id: '',
        problem_category: '',
        problem_level: '',
        problem_description: '',
        remark: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      },
      formLabelWidth: '120px',
      rules: {
        case_item_id: [
          { required: true, message: '测试项目标识不能为空', trigger: 'blur' }
        ],
        case_id: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        result: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        case_result: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ]
      }
    };
  },
  methods: {
    submitForm(formName) {
      const _this = this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          axios.post('http://localhost:8088/case_test/save', this.ruleForm).then(function(resp) {
            if (resp.data === 'success') {
              _this.$alert('《' + _this.ruleForm.case_id + '》添加成功！', '消息', {
                confirmButtonText: '确定',
                callback: action => {
                  _this.$router.push('/Main')
                }
              })
            }
          })
        } else {
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    submitForm1(formName) {
      const _this = this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          axios.post('http://localhost:8088/problem/save', this.ruleForm).then(function(resp) {
            if (resp.data === 'success') {
              _this.$alert('《' + _this.ruleForm.problem_id + '》添加成功！', '消息', {
                confirmButtonText: '确定',
                callback: action => {
                  _this.$router.push('/Main')
                }
              })
            }
          })
        } else {
          return false;
        }
      });
    }
  }
}
</script>

<style scoped>

</style>
